<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>代码量统计报告</title>
    <style>
        body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; margin: 0; padding: 20px; background: #f5f5f5; }
        .container { max-width: 1200px; margin: 0 auto; background: white; padding: 30px; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); }
        h1 { color: #333; text-align: center; margin-bottom: 30px; }
        .stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 20px; margin-bottom: 30px; }
        .stat-card { background: #f8f9fa; padding: 20px; border-radius: 6px; text-align: center; }
        .stat-number { font-size: 2em; font-weight: bold; color: #007bff; }
        .stat-label { color: #666; margin-top: 5px; }
        table { width: 100%; border-collapse: collapse; margin: 20px 0; }
        th, td { padding: 12px; text-align: left; border-bottom: 1px solid #ddd; }
        th { background: #f8f9fa; font-weight: 600; }
        .large-files { margin-top: 30px; }
        .file-item { padding: 10px; margin: 5px 0; background: #f8f9fa; border-radius: 4px; }
    </style>
</head>
<body>
    <div class="container">
        <h1>📊 代码量统计报告</h1>
        
        <div class="stats-grid">
            <div class="stat-card">
                <div class="stat-number">143</div>
                <div class="stat-label">总文件数</div>
            </div>
            <div class="stat-card">
                <div class="stat-number">29,995</div>
                <div class="stat-label">总行数</div>
            </div>
            <div class="stat-card">
                <div class="stat-number">24,738</div>
                <div class="stat-label">代码行数</div>
            </div>
            <div class="stat-card">
                <div class="stat-number">13.5%</div>
                <div class="stat-label">注释率</div>
            </div>
        </div>

        <h2>📋 文件类型统计</h2>
        <table>
            <thead>
                <tr><th>类型</th><th>文件数</th><th>总行数</th><th>代码行</th><th>占比</th></tr>
            </thead>
            <tbody>
                <tr>
            <td>TypeScript</td>
            <td>138</td>
            <td>25,490</td>
            <td>20,270</td>
            <td>81.9%</td>
          </tr><tr>
            <td>JSON</td>
            <td>2</td>
            <td>4,288</td>
            <td>4,286</td>
            <td>17.3%</td>
          </tr><tr>
            <td>Markdown</td>
            <td>1</td>
            <td>159</td>
            <td>127</td>
            <td>0.5%</td>
          </tr><tr>
            <td>CSS/LESS/SCSS</td>
            <td>2</td>
            <td>58</td>
            <td>55</td>
            <td>0.2%</td>
          </tr>
            </tbody>
        </table>

        <div class="large-files">
            <h2>📄 大文件列表 (>200行)</h2>
            <div class="file-item">
          <strong>.umi\appData.json</strong> 
          <span style="color: #666;">(JSON)</span>
          <span style="float: right; color: #007bff;">4243 行 / 4242 代码行</span>
        </div><div class="file-item">
          <strong>pages\LogManagement\ErrorLogs\index.tsx</strong> 
          <span style="color: #666;">(TypeScript)</span>
          <span style="float: right; color: #007bff;">884 行 / 840 代码行</span>
        </div><div class="file-item">
          <strong>pages\LogManagement\OperationLogs\index.tsx</strong> 
          <span style="color: #666;">(TypeScript)</span>
          <span style="float: right; color: #007bff;">710 行 / 674 代码行</span>
        </div><div class="file-item">
          <strong>pages\LogManagement\SystemLogs\index.tsx</strong> 
          <span style="color: #666;">(TypeScript)</span>
          <span style="float: right; color: #007bff;">593 行 / 559 代码行</span>
        </div><div class="file-item">
          <strong>pages\DataStatistics\SystemStats\index.tsx</strong> 
          <span style="color: #666;">(TypeScript)</span>
          <span style="float: right; color: #007bff;">485 行 / 452 代码行</span>
        </div><div class="file-item">
          <strong>pages\DataStatistics\ContentStats\index.tsx</strong> 
          <span style="color: #666;">(TypeScript)</span>
          <span style="float: right; color: #007bff;">474 行 / 441 代码行</span>
        </div><div class="file-item">
          <strong>pages\UserManagement\UserList\index.tsx</strong> 
          <span style="color: #666;">(TypeScript)</span>
          <span style="float: right; color: #007bff;">465 行 / 426 代码行</span>
        </div><div class="file-item">
          <strong>pages\CourseManagement\CourseList\components\LessonManagement.tsx</strong> 
          <span style="color: #666;">(TypeScript)</span>
          <span style="float: right; color: #007bff;">460 行 / 423 代码行</span>
        </div><div class="file-item">
          <strong>pages\DataStatistics\LearningStats\index.tsx</strong> 
          <span style="color: #666;">(TypeScript)</span>
          <span style="float: right; color: #007bff;">425 行 / 394 代码行</span>
        </div><div class="file-item">
          <strong>pages\LearningContentManagement\DailySentenceList\index.tsx</strong> 
          <span style="color: #666;">(TypeScript)</span>
          <span style="float: right; color: #007bff;">425 行 / 393 代码行</span>
        </div>
        </div>

        <p style="text-align: center; color: #666; margin-top: 40px;">
            报告生成时间: 2025/7/7 13:02:34
        </p>
    </div>
</body>
</html>